<template>
    <view class="con">
        <view class="profit">
            <view class="profit-item">
                <view class="profit-num">{{data.tdall_cy}}元</view>
                <view class="profit-name">今日收益</view>
            </view>
            <view class="profit-item">
                <view class="profit-num">{{data.ytdall_cy}}元</view>
                <view class="profit-name">昨日收益</view>
            </view>
            <view class="profit-item">
                <view class="profit-num">{{data.weekall_cy}}元</view>
                <view class="profit-name">本周收益</view>
            </view>
            <view class="profit-item">
                <view class="profit-num">{{data.all_cy}}元</view>
                <view class="profit-name">累计收益</view>
            </view>
            <view class="profit-item" @click="toTeam">
                <view class="profit-num">{{data.usercount}}人</view>
                <view class="profit-name">我的会员</view>
            </view>
        </view>
        <view class="list">

            <u-sticky>
                <view class="list-title">分销订单</view>
            </u-sticky>
            <view style="display: flex;justify-content: center;">
                <u-button type="primary" @click="showTime=true" size="medium">{{date_text}}</u-button>
                
            </view>
            <view class="profit">
                <view class="profit-item" style="width: 50%;">
                    <view class="profit-num">{{data.result_fen_yong}}元</view>
                    <view class="profit-name">收益汇总</view>
                </view>
                <view class="profit-item" style="width: 50%;">
                    <view class="profit-num">{{data.result_wp}}</view>
                    <view class="profit-name">回收重量</view>
                </view>
            </view>
            <view class="list-i">
                <view class="list-i-item" v-for="(item,index) in data.list" :key="index">
                    <view style="display: flex;justify-content: space-between;">
                        <!-- <image src="@/static/img/myhome/home-jinbi@3x.png"></image> -->
                        <view class="list-i-item-time">
                            <view class="list-i-item-time-name">订单金额：￥{{item.order_price}}</view>
                            <view class="list-i-item-time-t">{{item.create_time | date}}</view>
                        </view>
                        <view class="list-i-item-price">￥{{item.fen_yong}}</view>
                        
                    </view>
                    <view style="display: flex;justify-content: space-between;" v-for="(wp) in item.order.item">
                        <view class="list-i-item-time" style="display: flex;justify-content: space-between;">
                            <view class="list-i-item-time-t" style="max-width: 300rpx; overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">品类:{{wp.wp_name}}</view>
                        </view>
                        <view class="list-i-item-time" style="display: flex;justify-content: space-between;">
                            <view class="list-i-item-time-t">重量:{{wp.nums}}</view>
                        </view>
                    </view>
                </view>
                <u-loadmore
                    :status="status" 
                    :load-text="loadText" />
            </view>
        </view>
        <u-calendar v-model="showTime" mode="range" @change="changeTime"></u-calendar>        
    </view>
</template>

<script>
    export default {
        data() {
            return {
                params: {
                    todaystime: null,//本日开始时间(时间戳)
                    todayetime: null,//本日结束时间(时间戳)
                    yestodaystime: null,//昨日开始时间(时间戳)
                    yestodayetime: null,//昨日结束时间(时间戳)
                    weekstime: null,//本周开始时间(时间戳)
                    weeketime: null, //本周结束时间(时间戳)
                    page: 1, //当前页数
                    limit:20, //每页数量[不传默认20],
                    start_date:'',
                    end_date:''
                },
                data: {},
                status: 'loading',
                loadText: {
                    loadmore: '上拉加载更多',
                    loading: '加载中...',
                    nomore: '没有更多数据了'
                },
                showTime:false,
                date_text:"请选择日期",
                date:[]
            }
        },

        onLoad() {
            // 今天
            var date = new Date();
            var year = date.getFullYear(); //获取当前年份
            var mon = date.getMonth() + 1; //获取当前月份
            var day = date.getDate(); //获取当前日
            this.params.todaystime = Date.parse(year + '-' + mon + '-' + day + ' 00:00:00') / 1000;
            this.params.todayetime = Date.parse(year + '-' + mon + '-' + day + ' 23:59:59') / 1000;
            
            // 昨天
            var date2 = new Date();
            date.setDate(date.getDate() - 1);
            var year2 = date.getFullYear();
            var mon2 = date.getMonth() + 1;
            var day2 = date.getDate();
            this.params.yestodaystime = Date.parse(year2 + '-' + mon2 + '-' + day2 + ' 00:00:00') / 1000;
            this.params.yestodayetime = Date.parse(year2 + '-' + mon2 + '-' + day2 + ' 23:59:59') / 1000;
            
            // 本周
            var Nowdate = new Date();
            var WeekFirstDay = new Date(Nowdate-(Nowdate.getDay()-1)*86400000); // 本周第一天
            var WeekLastDay = new Date((WeekFirstDay/1000+6*86400)*1000);// 本周第最后一天
            this.params.weekstime = Date.parse(WeekFirstDay.getFullYear() + '-' + (WeekFirstDay.getMonth() + 1) + '-' + WeekFirstDay.getDate() + ' 00:00:00') / 1000;
            this.params.weeketime = Date.parse(WeekLastDay.getFullYear() + '-' + (WeekLastDay.getMonth() + 1) + '-' + WeekLastDay.getDate() + ' 23:59:59') / 1000;
            
            this._getFenxiaoOrder();
        },
        onReachBottom() {
            this.params.page++;
            this._getHsAmount();
        },
        methods: {
            changeTime(e){
                let arr = [e.startDate,e.endDate]
                
                this.date_text = arr[0]+'至' +arr[1]
                this.params.page = 1
                this.params.start_date = arr[0]
                this.params.end_date = arr[1]
                
                this._getFenxiaoOrder()
                console.error(e)
            },
            _getFenxiaoOrder() {
                this.status = 'loading';

                this.$u.api.getFenxiaoOrder(this.params).then(res => {
                    if(this.params.page == 1) {
                        this.status = 'nomore';
                        this.data = res;
                    } else {
                        if(res.list <= 0) {
                            this.status = 'nomore';
                            this.params.page = res.page;
                            return ;
                        }
                        this.data.list = this.data.list.concat(res.list);
                    }
                })
            },
            toTeam(){
                uni.navigateTo({
                    url:"/mypages/Myhome/team"
                })
            }
        },
    }
</script>

<style lang="scss" scoped>
    .con {
        padding: 30rpx;
        
        .profit {
            background-color: #FFFFFF;
            border-radius: 20rpx;
            display: flex;
            flex-wrap: wrap;
            margin-bottom: 30rpx;
            
            .profit-item {
                width: 33%;
                height: 136rpx;
                display: flex;
                align-items: center;
                justify-content: center;
                flex-direction: column;
                
                .profit-num {
                    font-size: 32rpx;
                    color: #191919;
                    font-weight: bold;
                    margin-bottom: 20rpx;
                }
                
                .profit-name {
                    font-size: 24rpx;
                    color: #999999;
                }
            }
        }
        
        .list {
            background-color: #FFFFFF;
            border-radius: 20rpx;
            
            .list-title {
                font-size: 32rpx;
                color: #191919;
                font-weight: bold;
                padding: 40rpx;
                background-color: #FFFFFF;
                border-radius: 20rpx;
            }
            
            .list-i {
                
                .list-i-item {
                    // display: flex;
                    // align-items: center;
                    // justify-content: space-between;
                    border-bottom: 1rpx solid #f2f2f2;
                    padding: 30rpx;
                    
                    image {
                        width: 58rpx;
                        height: 58rpx;
                        margin-right: 30rpx;
                    }
                    .list-i-item-time {
                        
                        
                        .list-i-item-time-name {
                            font-size: 28rpx;
                            color: #191919;
                            font-weight: bold;
                        }
                        
                        .list-i-item-time-t {
                            color: #999999;
                            font-size: 24rpx;
                        }
                    }
                    
                    .list-i-item-price {
                        font-size: 36rpx;
                        color: #ff4200;
                        font-weight: bold;
                    }
                }
            }
        }
    }
</style>
